// icons

.icon {
  display: inline-block;
  position: relative;
  width: $icon-size-base;
  height: $icon-size-base;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
  vertical-align: middle;

  &:after {
    position: absolute;
    content: '';
  }

  &--chart {
    top: -2px;
    width: 20px;
    height: 21px;
    background-image: url('~images/icons/chart.png');
  }

  &--check {
    top: -2px;
    background-image: url('~images/icons/check.png');

    &.lg {
      width: 26px;
      height: 26px;
    }
  }

  &--clock {
    top: -2px;
    width: 20px;
    height: 21px;
    background-image: url('~images/icons/clock.png');
  }

  &--close {
    top: -2px;
    width: 16px;
    height: 16px;
    background-image: url('~images/icons/close.png');
  }

  &--complete {
    top: -2px;
    width: 20px;
    height: 20px;
    background-image: url('~images/icons/complete.png');
  }

  &--exclamation {
    top: -2px;
    background-image: url('~images/icons/exclamation.png');

    &.lg {
      width: 26px;
      height: 26px;
    }
  }

  &--finance {
    top: -2px;
    width: 20px;
    height: 21px;
    background-image: url('~images/icons/finance.png');
  }

  &--info {
    top: -2px;
    width: 23px;
    height: 16px;
    background-image: url('~images/icons/info.png');
  }

  &--lock {
    top: -2px;
    width: 19px;
    height: 22px;
    background-image: url('~images/icons/lock.png');
  }

  &--manager {
    top: -2px;
    width: 30px;
    height: 30px;
    background-image: url('~images/icons/manager.png');
  }

  &--question {
    top: -2px;
    background-image: url('~images/icons/question.png');
  }

  &--shield {
    top: -2px;
    width: 20px;
    height: 21px;
    background-image: url('~images/icons/shield.png');
  }

  &--telephone {
    top: -2px;
    width: 22px;
    height: 22px;
    background-image: url('~images/icons/telephone.png');
  }

  &--triangle-down:after {
    top: 50%;
    left: 50%;
    margin-top: -3px;
    margin-left: -5px;
    border-top: 6px solid $primary;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 0;
  }
}